<div class="am-u-sm-12 widget" style="margin:10px">

	<div class="am-u-sm-12 ">

		<form class="am-form tpl-form-border-form tpl-form-border-br">

			<div class="am-u-sm-12" style="margin-bottom: 10px;">
				<div class="am-u-sm-6 cl-p">
					<label for="user-intro" class="am-u-sm-2 am-form-label">用车时间</label>
					<div class="am-u-sm-10 cl-p">
						<div class="am-u-sm-6 am-input-group am-datepicker-date Iclose" data-am-datepicker="{format: 'yyyy-mm', viewMode: 'years', minViewMode: 'months'}">
							<input type="text" class="am-form-field " placeholder="日历组件" readonly>
							<span class="am-input-group-btn am-datepicker-add-on">
	    				<button class="am-btn am-btn-default" type="button">
	    					<span class="am-icon-calendar"></span>
							</button>
							</span>
						</div>
						<div style="position: absolute;left: 50%;margin-left: -8px;line-height: 38px;">至</div>
						<div class="am-u-sm-6 am-input-group am-datepicker-date Iclose" data-am-datepicker="{format: 'yyyy-mm', viewMode: 'years', minViewMode: 'months'}">
							<input type="text" class="am-form-field" placeholder="日历组件" readonly>
							<span class="am-input-group-btn am-datepicker-add-on">
	    				<button class="am-btn am-btn-default" type="button">
	    					<span class="am-icon-calendar"></span>
							</button>
							</span>
						</div>
					</div>
				</div>
				<div class="am-u-sm-6 cl-p">
					<label for="user-intro" class="am-u-sm-2 am-form-label">申请时间</label>
					<div class="am-u-sm-10 cl-p">
						<div class="am-u-sm-6 am-input-group am-datepicker-date Iclose" data-am-datepicker="{format: 'yyyy-mm', viewMode: 'years', minViewMode: 'months'}">
							<input type="text" class="am-form-field " placeholder="日历组件" readonly>
							<span class="am-input-group-btn am-datepicker-add-on">
	    				<button class="am-btn am-btn-default" type="button">
	    					<span class="am-icon-calendar"></span>
							</button>
							</span>
						</div>
						<div style="position: absolute;left: 50%;margin-left: -8px;line-height: 38px;">至</div>
						<div class="am-u-sm-6 am-input-group am-datepicker-date Iclose" data-am-datepicker="{format: 'yyyy-mm', viewMode: 'years', minViewMode: 'months'}">
							<input type="text" class="am-form-field" placeholder="日历组件" readonly>
							<span class="am-input-group-btn am-datepicker-add-on">
	    				<button class="am-btn am-btn-default" type="button">
	    					<span class="am-icon-calendar"></span>
							</button>
							</span>
						</div>
					</div>
				</div>

			</div>
			<div class="am-u-sm-12" style="margin-bottom: 10px;">

				<div class="am-u-sm-12 cl-p">
					<label for="user-intro" class="am-u-sm-1 am-form-label">用车人</label>
					<div class="am-u-sm-6">
						<div class="am-u-sm-12 cl-p">
							<div class="am-u-sm-6 cl-p">
								<input type="text" class="am-form-field tpl-form-no-bg" style="line-height: 21px;" placeholder="用车人姓名/电话">
							</div>
							<div class="am-u-sm-6 ">
								<select data-am-selected="{btnWidth: '100%'}">
									<option value="option1">所有司机</option>
									<option value="option2">已关联司机</option>
									<option value="option3">未关联司机</option>
								</select>
							</div>
						</div>
					</div>
					<div class="am-u-sm-3 ">
						<input type="text" class="am-form-field tpl-form-no-bg" style="line-height: 21px;" placeholder="订单号">

					</div>

					<div class="am-u-sm-2">
						<button class="am-btn-secondary am-btn am-btn-sm am-radius">查询<i class="am-icon-search"></i></button>
					</div>
				</div>

			</div>
		</form>
		<div><button style="float: right;" type="button" class="am-btn am-btn-default am-radius am-btn-xs" style="margin-top: -2px;">导出文件</button></div>
		<table width="100%" class="am-table am-table-compact am-text-nowrap tpl-table-black " >
			<thead>
				<tr>
					<th>乘客</th>
					<th>所属公司</th>
					<th>用车类型</th>
					<th>出发地</th>
					<th>目的地</th>
					<th>出发时间</th>
					<th>到达时间</th>
					<th>里程</th>
					<th>耗时</th>
					<th>费用</th>
					<th>司机</th>
					<th>异常</th>
					<th>订单状态</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody>
				{foreach $list as $key => $item}
				<tr class="gradeX">
					<td>{$item.role_id}</td>
					<td>{$item.name}</td>
					<td>{$item.role_id}</td>
					<td>{$item.role_id}</td>
					<td>{$item.role_id}</td>
					<td>{$item.role_id}</td>
					<td>{$item.role_id}</td>
					<td>{$item.role_id}</td>
					<td>{$item.role_id}</td>
					<td>{$item.role_id}</td>
					<td>{$item.role_id}</td>
					<td>{$item.role_id}</td>
					<td>{$item.role_id}</td>
					<td>
						<div class="tpl-table-black-operation">
							<a href="/admin/order/paicheye">
								<i class="am-icon-pencil"></i> 详情
							</a>
							<a href="javascript:;" data-method="offset" class="tpl-table-black-operation-del showmap">
								<i class="am-icon-pencil"></i> 轨迹
							</a>
						</div>
					</td>
				</tr>
				{/foreach}

			</tbody>
		</table>
	</div>
</div>
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.2&key={:config('base.mapkey')}&plugin=AMap.Driving"></script>
<script src="//webapi.amap.com/ui/1.0/main.js?v=1.0.11"></script>